
<template>
  <div>
    <van-dropdown-menu>
      <van-dropdown-item v-model="role" :options="roles" />
      <van-dropdown-item v-model="state" :options="states" />
    </van-dropdown-menu>
    <van-field v-model="searchUser" center clearable label="电话号码" placeholder="请输入关键词" >
      <van-button slot="button" size="small" type="primary" @click="getLists">查询</van-button>
    </van-field>
      
    <van-address-list :switchable="false" add-button-text="新增用户"
      v-model="chosenId"
      :list="list"
      default-tag-text="默认"
      @edit="onEdit"
      @add="onAdd"
    />

    <van-dialog v-model="showAdd" title="用户" :lazy-render="false" :showConfirmButton="false" show-cancel-button>
        <user @onAdded="onAdded" :user="user"/>
    </van-dialog>
  </div>
</template>

<script>
  import { get } from "@/api/common";
  import User from "./user";
  import { Toast,Dialog } from 'vant';

  export default {
    name: "freestay",
    components: {
      User
    },
    computed: {
      reversedMessage: function () {
        // `this` 指向 vm 实例
        return this.message.split('').reverse().join('')
      }
    },
    data() {
      return {
        checkeds: [],
        searchUser: '',
        role: 0,
        state: 0,
        roles: this.$store.state.roles,
        states: this.$store.state.states,
        showAdd: false,
        user: {id:0,login_id:'',name:'',rid:'',job:'',weixin:'',state:''},
        chosenId: 0,
        list: [],
      }
    },
    mounted() {
      //this.getLists();
    },
    methods: {
      getState(state) {
        var value = '';
        for(var i=0;i<this.states.length;i++) {
          if(this.states[i].value==state) {
            value = this.states[i].text;
            break;
          }
        }
        console.log(state+'---'+value);
        return value;
      },
      // 调用api获得当前选择的申请列表
      getLists(){
        let body = {
                  '@column': 'id,login_id,name,rid,job,weixin,state',
                  'rid{}': [10,11,12,13],
                  };
        if(this.role>0)
          body['role_id'] = this.role;
        if(this.state>0)
          body['state'] = this.state;
        if(this.searchUser!='')
          body['login_id$'] = '%'+this.searchUser+'%';
        let params = {'[]': {
                'Eova_user': body,
                'Eova_role':{
                  '@column': 'id,name',
                  'id@': '/Eova_user/rid',
                }
              },
              '@schema': 'eova'
            };
        get(params)
          .then( res=> {
            var data = res.data["[]"];
            this.list = [];
            for(var d in data) {
              var u = data[d].Eova_user;
              var r = data[d].Eova_role;
              u['tel'] = u.login_id;
              u['address'] = r.name+'-'+this.getState(u.state)+'-'+u.job+'-'+u.weixin;
              this.list.push(u);
            }
          })
          .catch(function (error){
              console.log(error);
          });
      },
      onAdd() {
        this.user = {id:0,login_id:'',name:'',rid:'',job:'',weixin:'',state:''};
        this.showAdd = true;
      },
      onAdded(value) {
        this.showAdd = false;
      },
      onEdit(item,index) {
        this.showAdd = true;
        this.user = item;
      }
    }
  }
</script>

<style scoped>
p{
  padding-left:10px;
}
</style>
  